<script setup>
import {reactive} from 'vue'
import Vifvshow from './components/1Vifvshow.vue'
import Vfor from './components/2Vfor.vue'
import Bind from './components/3ProBind.vue'
import Response from './components/4Resposive.vue'
import Vmodel from './components/5Vmodel.vue'
import Vhtml from './components/6VHtml.vue'
import Method from './components/7Method.vue'
import Component from './components/8Computed.vue'
import Watch from './components/9Watch.vue'
import Filterer from './components/10Filter.vue'
import Refs from './components/11Ref.vue'
import Von from './components/12Von.vue'
import LifeCycleHook from './components/13LifeCycleHook.vue'
import CusIns from './components/14CusIns.vue'
import Transitions from './components/15Transition.vue'
import Comp from './components/16Comp.vue'
import Props from './components/17Props.vue'
const todo = reactive({
  name: 'giluo',
})
import Slot from './components/18Slot.vue'
import OwnEvent from './components/19Event.vue'
import Class from './components/20Class.vue'
import Style from './components/21Style.vue'
import Render from './components/22Render.vue'
</script>

<template>
  <div>
    <Vifvshow />
    <Vfor />
    <bind />
    <response />
    <vmodel />
    <Vhtml />
    <Method />
    <Component />
    <Watch />
    <Filterer />
    <Refs />
    <Von />
    <LifeCycleHook />
    <CusIns />
    <Transitions />
    <Comp />
    <Props :todo="todo"/>
    <Slot>
      <template v-slot:header>
        <span>header插槽</span>
      </template>
      <template v-slot:main>
        <span>main插槽</span>
      </template>
    </Slot>
    <OwnEvent />
    <Class />
    <Style />
    <Render />
  </div>
</template>

<style>
  
</style>
